<template>
  <LatentProductManage
    ref="latentRef"
    isAdd
    title="线索转潜在商品"
    :columns="columns"
    :load-data="getAddList"
    :submit-data="submitOrSave"
    :get-replace-btn="getReplaceSkuBtn"
  />
</template>
<script>
import LatentProductManage from './components/LatentProductManage';
import { TABLE_COLUMNS, TABLE_COLUMNS_WITH_REASON } from './constants/add';
import { TIPS_COLUMN } from './constants/common';
import { isResponseSuccess } from '@/utils/bizUtils';
import {
  getTempToPotentialInfoService,
  saveOrSubmitTempToPotentialInfoService,
  replaceSkuService
} from '@/api/commodity/temporaryPurchasingGoods/latentProduct';
export default {
  components: {
    LatentProductManage,
  },
  data () {
    return {
      columns: TABLE_COLUMNS,
      replaceSkuBtn: {
        show: false, // 替换商品按钮展示状态
        loading: false,
      }
    }
  },
  methods: {
    // 获取新增列表
    async getAddList (loadingFn) {
      const data = { orderInquiryNo: this.$route?.query?.orderInquiryNo }
      const res = await getTempToPotentialInfoService(data, loadingFn)
      this.updateTableColumns(res?.retData ?? []) // 更新表格表列
      if (res?.retData.length == 0) {
        this.$alert('商品已全部替换，返回订货定标页', '提示', {
          confirmButtonText: '确定',
          type: 'warning',
        }).then(() => { this.leaveCurPage() })
      }
      return res
    },
    // 提交操作
    async submitOrSave (tableInfo, loadingFn, isSubmit) {
      const data = {
        isSubmit,
        saveOrSubmitTempToPotentialInfoDetailParams: tableInfo.list
      }
      const res = await saveOrSubmitTempToPotentialInfoService(data, loadingFn)
      const onSuccess = () => {
        this.$message.success('操作成功')
        isSubmit && this.leaveCurPage()
      }
      const onFail = echoList => {
        this.$message.warning('有异常原因禁止提交')
        const curColumns = tableInfo.columns.filter(item => item.key != TIPS_COLUMN.key)
        tableInfo.setColumns([
          TIPS_COLUMN,
          ...curColumns
        ])
        tableInfo.setList(echoList)
        this.replaceSkuBtn.show = echoList.some(item => item.hasDuplicateSku)
      }
      if (!isResponseSuccess(res)) return
      if (!isSubmit) return this.$message.success('操作成功')
      const isSuccess = !res?.retData // retData为null是成功
      isSuccess ? onSuccess() : onFail(res.retData)
    },
    // 确认是否离开当前页面
    leaveCurPage () {
      this.$router.push({ name: 'orderCalibration' })
    },
    // 更新表格表列
    updateTableColumns (dataList) {
      const hasReasonType = dataList.some(item => item.reasonType)
      this.columns = hasReasonType ? TABLE_COLUMNS_WITH_REASON : TABLE_COLUMNS
    },
    // 获取替换商品按钮
    getReplaceSkuBtn (tableList) {
      const btnVo = {
        label: '替换商品',
        method: () => { this.handleReplaceSku(tableList) },
        loading: this.replaceSkuBtn.loading
      }
      if (!this.replaceSkuBtn.show) return
      return btnVo
    },
    // 替换商品
    async handleReplaceSku (tableList) {
      const tempToPotentialReplaceSkuDetailParams = tableList
        .filter(item => item.hasDuplicateSku)
        .map(item => _.pick(item, ['recordDetailUuid', 'skuNo', 'duplicateSkuNo']))
      const data = { tempToPotentialReplaceSkuDetailParams }
      const loadingFn = state => { this.replaceSkuBtn.loading = state }
      const res = await replaceSkuService(data, loadingFn)
      if (!isResponseSuccess(res)) return
      res?.retData?.hasTipMsg
        ? this.$message.info(res?.retData?.tipMsg)
        : this.$message.success('操作成功')
      this.replaceSkuBtn.show = false
      this.$refs.latentRef.loadTableList()
    },
  }
}
</script>
